<template>
  <div class="about">
   
    <my-header v-model="title" @down="addOk(title)">
        <h1>TODOLIST</h1>
    </my-header>
    <my-task :list="resList">
        <h1>全部任务</h1>
    </my-task>
     <my-task :list="doing">
        <h1>正在进行的任务</h1>
    </my-task>
    <my-task :list="done">
        <h1>已经完成的任务</h1>
    </my-task>
    
  </div>
</template>
<script>
import myHeader from '../components/myHeader'
import myTask from '../components/myTask'
import {mapState,mapActions,mapGetters,mapMutations} from 'vuex'
export default {
    data() {
        return {
            title:''
        }
    },
    created() {
        if(!this.$store.state.resList.length){
              this.getList()
        }
      
    },
    computed:{
        ...mapState(['resList']),
        ...mapGetters(['doing','done'])
    },
    methods: {
       
        ...mapActions(['getList']),
        // addTask(){
        //     this.$store.commit('addOk',this.title)
        //     this.title = ''
        // },
        // addTask(){
        //     this.addOk(this.title)
        //     this.title = ''
        // },
        ...mapMutations(['addOk'])
        
    },
    components:{
        myHeader,
        myTask
    }
}
</script>
